<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="easyui.css">
<link rel="stylesheet" href="icon.css">
<link rel="stylesheet" href="demo.css">
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
$(function(){
	  
	$('#panel').on('click','.operate',function (){
		 var name =$(this).data('href');
		 var data = {};
		 data['name'] =name;
		 $.ajax({
			 type:"post",
			 url:"getMovie",
			 data:data,
			 success:function(data){
                window.open(data);
			 }
		 })
	});
	var data ={
			doSearch:function dataGrid(data){
				 $.ajax({
						type : "post",
						url : "DouBanServlet",
						data:data,
						success : function(data) {
							console.log(data);
							var d = JSON.parse(data);
							 $("#dd").datagrid({  
						         title:"电影",  
						         rownumbers:true,  
						         fitColumns:true,  
						         pagination:true,  
						         data:d.slice(0,10),  
						         columns:[  
						             [  
						                 {field:'href', align:"center", title:"链接地址", width:100,formatter:function(value){
						                	 return "<a href="+value+"  target=\"_blank\">"+value+"</a>"; 
						                 }}, 
						                 {field:'title', align:"center", title:"标题", width:100},
						                 {field:'pic', align:"center", title:"图片", width:100,formatter:function(value){
						                	 return "<img src="+value+" height="+100+" weight="+100+">";
						                	 
						                 }} ,
						                 {field:'operate_detail',align:"center",title:"操作",width:100,formatter:function(value,row){
						                   var s="";
						                   var id = row.id;
						                   var href = row.title;
						                         s+='<a href="#" class="easyui-linkbutton operate" id="' + id + '" data-href="'+href+'"  data-options="iconCls:'+ '"icon-search"' + '>电影播放</a>';
						                        return s;
						                 }}
						             ]  
						         ]  
						     });  
						     var pager = $("#dd").datagrid("getPager");  
						     pager.pagination({  
						         total:d.length,  
						         onSelectPage:function (pageNo, pageSize) {  
						             var start = (pageNo - 1) * pageSize;  
						             var end = start + pageSize;  
						             $("#dd").datagrid("loadData", d.slice(start, end));  
						             pager.pagination('refresh', {  
						                 total:d.length,  
						                 pageNumber:pageNo  
						             });  
						         }  
						     });  
						}
					}); 
					}
			
	};
	var datas={};
	data.doSearch(datas);
	sub = function(){
		var name = $('#name').val();
		var obj ={};
		obj['name'] =name;
		data.doSearch(obj);
		};
});

</script>
</head>
<body>
<h2>取自豆瓣电影前250</h2>
	<form action="Pachong" method="POST">
	<input type="text" id="name">
	<input type="button" value="电影查询" onclick="sub()" >
	<a href="MovieCount.jsp">电影类型统计</a>
	</form>
	<div id="panel">
	<table id="dd"></table>
	</div>
</body>
</html>